<template>
	<view class="announce_deta">
		<text class="deta_title">小区公告标题</text>
		<view class="deta_head">
			<view class="head_fl">
				<image class="deta_head_img" :src="announceDetails.avatar" mode=""></image>
				<text>{{announceDetails.name || ''}}</text>
			</view>
			 <text class="head_fr">{{announceDetails.create_time || ''}}</text>
		</view>
		<view class="deta_info">
			{{announceDetails.content || ''}}
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 公告详情
				id: null,
				announceDetails: {}
			};
		},
		onLoad(option) {  
			option.id? this.id = option.id : null
			console.log(option)
		},
		onShow() {
			// 获取详情
			this.getNoticeDetail(this.id)
		},
		methods:{
			// 获取公告详情
			getNoticeDetail(id){ 
				let _this = this
				_this.$mrequest2({
					url: 'Mini/property/notice_show/' + id,
					method: 'GET'
				}).then(res => { 
					if(res.code == 200){
						_this.announceDetails = res.data
						console.log(res.data)
					}
				})
			}
		}
	}
</script>

<style lang="scss">
.announce_deta{ 
	padding: 0 30rpx 30rpx 30rpx;
	.deta_title{
		display: block;
		width: 100%;
		height: 100rpx;
		font-size: 32rpx;
		line-height: 100rpx;
		text-align: center;
		color: #333;
		font-weight: 700;
	}
	.deta_head{
		display: flex;
		justify-content: space-between;
		height: 80rpx;
		line-height: 80rpx;
		border-bottom: 2rpx solid #999;
		.head_fl{
			display: flex; 
			width: 50%;
			.deta_head_img{
				margin-right: 20rpx;
				width: 54rpx;
				height: 54rpx;
				border-radius: 50%;
				background-color: #eee;
			}
		}
		 
		
	}
	.deta_info{
		padding: 20rpx 0;
		font-size: 28rpx;
		color: #737373;
	}
}
</style>
